<template>
    <h3>让大哥不上课</h3>
    <table border="1">
        <tr>
            <td>用户名</td>
            <td>
                
                <input  type="text" placeholder="请填写用户名" v-model="info.name"/>
            </td>

        </tr>
        <tr>
            <td>密码</td>
            <td>
                
                <input  type="password" placeholder="请填写密码" v-model="info.password"/>
            </td>

        </tr>
        <tr>
            <td>真实姓名</td>
            <td>
                
                <input  type="text" placeholder="请填写真实姓名" v-model="info.userName"/>
            </td>

        </tr>
        <tr>
            <td>邮箱</td>
            <td>
                
                <input  type="text" placeholder="请填写邮箱" v-model="info.email"/>
            </td>

        </tr>
        <tr>
            <td>用户状态</td>
            <td>
                
            <select v-model="info.state">
                <option :value="true">启用</option>
                <option :value="false">禁用</option>
            </select>
            </td>

        </tr>
        <tr>
            <td>用户类型</td>
            <td>
                
                <select v-model="info.m_Id">
                    <option :value="0">请选择</option>
                    <option v-for="item in type" :value="item.id">{{ item.typename }}</option>
                </select>
            </td>

        </tr>
        <tr>
            <td></td>
            <td>
                
                <input  type="button" value="添加" @click="adduser"/>
            </td>

        </tr>

    </table>
</template>
<script setup lang="ts">
import { ref,onMounted } from 'vue';
import axios from 'axios';

onMounted(()=>{
    showtype();
})

const info=ref({
    "name": "",
    "userName": "",
    "email": "",
    "state": true,
    "password": "",
    "m_Id": 0
})

const type=ref([{
     "id": 0,
    "typename": ""

}])

const showtype=()=>{
    axios.get("https://localhost:7231/api/User/GetUsertypes")
    .then(res=>{
        console.log(res.data);
        type.value=res.data;
    })
}

const adduser=()=>{
    axios.post("https://localhost:7231/api/User/AddUser",info.value)
    .then(res=>{
        alert('添加成功');
    })
    .catch(res=>{
        alert('出现异常,添加失败');
    })
}
</script>